import React from 'react';
import { inject, observer } from 'mobx-react';
import { WeaSwitch, WeaTableNew } from 'comsMobx';
import { toJS } from 'mobx';
import {
  WeaTop,
  WeaLeftTree,
  WeaLeftRightLayout,
  WeaRightMenu,
  WeaErrorPage,
  WeaTools,
  WeaTab,
  WeaFormItem,
  WeaSearchGroup,
  WeaDialog,
  WeaLocaleProvider,
  WeaProgress,
} from 'ecCom';
import { Button, Modal, message } from 'antd';
import '../style/photoView.less';

const confirm = Modal.confirm;
const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

// 渲染优化 单独提出的组件
class WeaLeftTreeCom extends React.PureComponent{
  constructor(props) {
    super(props);
    this.onSelect = this.onSelect.bind(this)
  }

  onSelect = (treeKey, topTabCount, treeNode) => {
    const { FrameStore } = this.props;
    const { treeData,  setShowname, setKey, setShowSearchAd } = FrameStore;

    FrameStore.setSelectedTreeKeys([treeKey]);
    setShowSearchAd(false);
    const id = treeKey.indexOf('album_') === 0 ? treeKey.substring(6) : '';
    let showName = '';
    if (treeNode.node) {
      const { name } = treeNode.node.props;
      showName = name;
    }
    if (treeNode.name) {
      let showName1 = '';
      treeData && treeData.forEach((t) => {
        if (t.domid == treeKey) {
          showName1 = t.name;
        }
        t.childs && t.childs.forEach((c) => {
          if (c.domid == treeKey) showName1 = c.name;
        });
      });
      if (treeNode.name == 'allNum') {
        showName = showName1;
      }
    }
    setKey(id);
    setShowname(showName);
  }

  render() {
    const { FrameStore, ecId, loadingTree } = this.props;
    const { treeData, treeCounts, countsType, selectedTreeKeys,  } = FrameStore;
    return(
      <WeaLeftTree ecId={ecId}
                   datas={toJS(treeData)}
                   selectedKeys={toJS(selectedTreeKeys)}
                   counts={toJS(treeCounts)}
                   countsType={toJS(countsType)}
                   defaultExpandLevel={1}
                   loading={loadingTree}
                   asyncLoad={true}
                   onSelect={this.onSelect}
      />
    )
  }
}

class WeaProgressCom extends React.PureComponent {
  shouldComponentUpdate(nextProps, nextState, nextContext) {
    if (nextProps.percent !== undefined && nextProps.percent === this.props.percent) {
      return false
    }
    return  true
  }

  render() {
    return(
      <WeaProgress strokeWidth={6} {...this.props}/>
    )
  }
}

@inject('FrameStore')
@observer
class Frame extends React.Component {
  constructor(props) {
    super(props);
    ['getOperatesClick', 'closeDialog1'].forEach(i => {
      this[i] = this[i].bind(this)
    })
  }
  componentDidMount() {
    const { FrameStore } = this.props;
    const { getTreeData, getConditionInfo } = FrameStore;
    getTreeData();
    getConditionInfo();
  }
  componentWillReceiveProps() {
  }
  componentWillUnmount() {
    const { FrameStore } = this.props;
    const { setTabData, setExpandedKey
      , setShowSearchAd } = FrameStore;
    setTabData([]);
    setExpandedKey([]);
    setShowSearchAd(false);
  }
  onRightMenuClick() {
    const Arr = [];
    return Arr;
  }
  getRightMenu() {
    const { FrameStore } = this.props;
    const { rightMenu, comsWeaTableStore, setDialogType, setVisible, albumRate, operatelevel, key } = FrameStore;
    const selectedRowKeys = comsWeaTableStore.selectedRowKeys;
    let btnArr = [];

    rightMenu.slice().forEach((m) => {
        let onClick = () => {};
        let content = m.menuName;
        let isDisabled = selectedRowKeys.length === 0;
        let isDisabled1 = true;
        if (key) {
        	isDisabled1 = false;
        }

        if (!isDisabled1) {
        	// 如果当前空间已经100%了 则不允许上传
            if (m.menuFun.indexOf('upload()') >= 0) {
            	if (albumRate >= 100.0) {
            		isDisabled1 = true;
            	} else {
            		isDisabled1 = false;
            	}
            	if (operatelevel < 1) {
            		isDisabled1 = true;
                }
            	onClick = () => {
                    setDialogType('upload');
                    setVisible(true);
                };
            }

        	if (m.menuFun.indexOf('onNewFolder()') >= 0) {
            	if (operatelevel < 1) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		setDialogType('onNewFolder');
                    setVisible(true);
                  };
            }

    		if (m.menuFun.indexOf('onBatchMove()') >= 0) {
            	if (operatelevel < 1 || isDisabled) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		setDialogType('onBatchMove');
                    setVisible(true);
                  };
            }
        	if (m.menuFun.indexOf('deletePhotoBatch()') >= 0) {
            	if (operatelevel < 2 || isDisabled) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		this.deletePhotoBatch();
                };
            }
        }
        if (m.isTop === '1') {
        	btnArr.push({
    	  	      key: m.type,
    	  	      icon: <i className={m.menuIcon} />,
    	  	      content: m.menuName,
    	  	      disabled: m.isControl == '1' && isDisabled1,
    	  	      onClick,
	  	    });
        }
      });

    return btnArr;
  }

  getButtons() {
    const { FrameStore } = this.props;
    const { rightMenu, comsWeaTableStore, setDialogType, setVisible, albumRate, operatelevel, key } = FrameStore;
    const selectedRowKeys = comsWeaTableStore.selectedRowKeys;

    let btnArr = [];
    rightMenu.slice().forEach((m) => {
        let onClick = () => {};
        let content = m.menuName;
        let isDisabled = selectedRowKeys.length === 0;
        let isDisabled1 = true;
        if (key) {
        	isDisabled1 = false;
        }

        if (!isDisabled1) {
        	// 如果当前空间已经100%了 则不允许上传
            if (m.menuFun.indexOf('upload()') >= 0) {
            	if (albumRate >= 100.0) {
            		isDisabled1 = true;
            	} else {
            		isDisabled1 = false;
            	}
            	if (operatelevel < 1) {
            		isDisabled1 = true;
                }
            	onClick = () => {
                    setDialogType('upload');
                    setVisible(true);
                };
            }

        	if (m.menuFun.indexOf('onNewFolder()') >= 0) {
            	if (operatelevel < 1) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		setDialogType('onNewFolder');
                    setVisible(true);
                  };
            }

    		if (m.menuFun.indexOf('onBatchMove()') >= 0) {
            	if (operatelevel < 1 || isDisabled) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		setDialogType('onBatchMove');
                    setVisible(true);
                  };
            }
        	if (m.menuFun.indexOf('deletePhotoBatch()') >= 0) {
            	if (operatelevel < 2 || isDisabled) {
            		isDisabled1 = true;
                }
            	onClick = () => {
            		this.deletePhotoBatch();
                };
            }
        }

        if (m.isTop === '1') {
        	btnArr.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@00jh39@${m.type}`}
          type="primary"
          disabled={(m.isControl == '1' && isDisabled1)}
          onClick={onClick}
        	>
        		{content}
        	</Button>);
        }
      });
    	return btnArr;
  }
  getTree() {
    const { FrameStore } = this.props;
    if (toJS(FrameStore.treeData).length){
      return (
        <WeaLeftTreeCom
          ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftTree@0spgzc`}
          FrameStore={FrameStore}
          loadingTree={FrameStore.loadingTree}
        />
      )
    }
  }

  setShowSearchAd = () => {
    const { setShowSearchAd, showSearchAd } = this.props.FrameStore;
    setShowSearchAd(!showSearchAd);
  }
  hideSearchAd = () => {
    const { setShowSearchAd } = this.props.FrameStore;
    setShowSearchAd(false)
  }
  setShowSearchAd = () => {
    const { setShowSearchAd, showSearchAd } = this.props.FrameStore;
    setShowSearchAd(!showSearchAd);
  }
  onSearch = () => {
    const { doSearch, parentid, form } = this.props.FrameStore;
    doSearch({ parentid, ...form.getFormParams() })
  }
  onSearchChange = (value) => {
    const { form, setQuickSearchValue } = this.props.FrameStore;
    form.updateFields({ [this.quickSearchPara]: { value } });
    setQuickSearchValue(value);
  }
  render() {
    const { FrameStore } = this.props;
    const { comsWeaTableStore, showSearchAd, dataKey, form, visible2, dialogtitle, visible } = FrameStore;
    const footer = [
                  <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@vdb8pv@backBtn`} key="back" type="ghost" onClick={this.closeDialog1.bind(this)}>{getLabel(1290, '返 回')}</Button>,
                  <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@vgjm9z@saveBtn`} key="submit" type="primary" onClick={this.saveDialog1.bind(this)}>
                  {getLabel(86, '保 存')}
                  </Button>];
    return (
      <div>
        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@6h16o0`} datas={this.getRightMenu()} >
          <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@9b6ywh`}
            title={FrameStore.title}
            loading={FrameStore.loading}
            icon={<i className="icon-coms-photo" />}
            iconBgcolor="#1a57a0"
            buttons={this.getButtons()}
            buttonSpace={10}
            showDropIcon={true}
            dropMenuDatas={this.getRightMenu()}
          >
            <WeaLeftRightLayout
              ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@322q71`}
              isNew={true}
              leftCom={this.getTree()} >
                <div style={{ position: 'relative' }}>
                  {this.getProcess()}
                    <WeaTab
                      ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@1f7844`}
                      buttonsAd={this.getTabButtonsAd()}
                      searchType={['base', 'advanced']}
                      searchsBaseValue={form.getFormParams()[this.quickSearchPara] || ''}
                      searchsAd={this.getSearchs}
                      showSearchAd={showSearchAd}
                      setShowSearchAd={this.setShowSearchAd}
                      hideSearchAd={this.hideSearchAd}
                      onSearch={this.onSearch}
                      onSearchChange={this.onSearchChange}
                    />
                </div>
                <WeaTable
                  ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@xex4qc`}
                  comsWeaTableStore={comsWeaTableStore}
                  sessionkey={dataKey}
                  hasOrder={true}
                  needScroll={true}
                  showThumbnails={true}
                  getColumns={this.reRenderColumns}
                  onOperatesClick={this.getOperatesClick}
                />
            </WeaLeftRightLayout>
          </WeaTop>

          <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@09r71f`}
            title={dialogtitle}
            visible={visible}
            buttons={footer}
            hasScroll={true}
            icon="icon-coms-photo"
            iconBgcolor="#1a57a0"
            onCancel={this.closeDialog1}
            zIndex={995}
            style={{ width: 520, height: 400 }}
          >
          <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@jba7zt`} datas={this.getRightMenu1()}>
	      {this.getItems1()}
	      </WeaRightMenu>
	      </WeaDialog>

	      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@3lnsfx`}
  title={getLabel(84040, '浏览照片')}
  visible={visible2}
  buttons={[
	                  <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@pk233q@backBtn`} key="back" type="ghost" onClick={this.closeDialog2.bind(this)}>{getLabel(1290, '返 回')}</Button>,
	                 ]}
  icon="icon-coms-photo"
  iconBgcolor="#1a57a0"
  onCancel={this.closeDialog2.bind(this)}
  zIndex={991}
  style={{ width: 1320, height: 600 }}
	      >
	      {this.getShowAlbum()}
	    </WeaDialog>

        </WeaRightMenu>
      </div>
    );
  }


  	getRightMenu1() {
	  	const { FrameStore } = this.props;
	  	const { chooseDialogRM, formImport, dialogType, form1, chooseDialogRM1, form2, chooseDialogRM2, form4, chooseDialogRM4 } = FrameStore;
	  	let btnArr = [];
	  	if (dialogType === 'upload') {
	  		const { isFormInit } = form2;
	  		isFormInit && chooseDialogRM2.slice().forEach((m) => {
		    	let onClick = () => {};
		    	if (m.menuFun.indexOf('saveDialog1()') >= 0) {
	            	onClick = () => {
	            		this.saveDialog1();
	                  };
	            }
		    	if (m.menuFun.indexOf('closeDialog1()') >= 0) {
	            	onClick = () => {
	            		this.closeDialog1();
	                  };
	            }

		    	btnArr.push({
		  	      key: m.type,
		  	      icon: <i className={m.menuIcon} />,
		  	      content: m.menuName,
		  	      onClick,
		  	    });
		    });
        }
	  	if (dialogType === 'onNewFolder' || dialogType === 'onEdit') {
	  		const { isFormInit } = formImport;
	  		isFormInit && chooseDialogRM.slice().forEach((m) => {
		    	let onClick = () => {};
		    	if (m.menuFun.indexOf('saveDialog1()') >= 0) {
	            	onClick = () => {
	            		this.saveDialog1();
	                  };
	            }
		    	if (m.menuFun.indexOf('closeDialog1()') >= 0) {
	            	onClick = () => {
	            		this.closeDialog1();
	                  };
	            }

		    	btnArr.push({
		  	      key: m.type,
		  	      icon: <i className={m.menuIcon} />,
		  	      content: m.menuName,
		  	      onClick,
		  	    });
		    });
        }
	  	if (dialogType === 'onBatchMove' || dialogType === 'onMove') {
        	const { isFormInit } = form1;
        	isFormInit && chooseDialogRM1.slice().forEach((m) => {
    	    	let onClick = () => {};
    	    	if (m.menuFun.indexOf('saveDialog1()') >= 0) {
                	onClick = () => {
                		this.saveDialog1();
                      };
                }
    	    	if (m.menuFun.indexOf('closeDialog1()') >= 0) {
                	onClick = () => {
                		this.closeDialog1();
                      };
                }

    	    	btnArr.push({
    	  	      key: m.type,
    	  	      icon: <i className={m.menuIcon} />,
    	  	      content: m.menuName,
    	  	      onClick,
    	  	    });
    	    });
        }
	  	if (dialogType === 'addAlbumReview' || dialogType === 'editAlbumReview') {
	  		const { isFormInit } = form4;
	  		isFormInit && chooseDialogRM4.slice().forEach((m) => {
		    	let onClick = () => {};
		    	if (m.menuFun.indexOf('saveDialog1()') >= 0) {
	            	onClick = () => {
	            		this.saveDialog1();
	                  };
	            }
		    	if (m.menuFun.indexOf('closeDialog1()') >= 0) {
	            	onClick = () => {
	            		this.closeDialog1();
	                  };
	            }

		    	btnArr.push({
		  	      key: m.type,
		  	      icon: <i className={m.menuIcon} />,
		  	      content: m.menuName,
		  	      onClick,
		  	    });
		    });
        }
	    return btnArr;
  	}

  getItems1() {
	    const { FrameStore } = this.props;
	    const { chooseDialogCon, formImport, chooseDialogCon1, form1, dialogType, form2, chooseDialogCon2, form4, chooseDialogCon4 } = FrameStore;
	    let items = [];
	    let group = [];
	    if (dialogType === 'upload') {
	    	const { isFormInit } = form2;
		    const formParams = form2.getFormParams();
		    isFormInit && chooseDialogCon2.slice().map((c) => {
		      c.items.map((fields, index) => {
		    	  fields.onUploading = (state) => {
		    		  this.hsaUploadState(state);
                  };
		        items.push({
	                com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@258k87@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : '258k87'}`}
  label={`${fields.label}`}
  labelCol={{ span: `${fields.labelcol}` }}
  wrapperCol={{ span: `${fields.fieldcol}` }}
	                >
		            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@b4bbcc@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'b4bbcc'}`} fieldConfig={fields} form={form2} formParams={formParams} />
		          </WeaFormItem>),
	                colSpan: 1,
		      });
		    });
	    });
	    }
	    if (dialogType === 'onNewFolder' || dialogType === 'onEdit') {
	    	const { isFormInit } = formImport;
		    const formParams = formImport.getFormParams();
		    isFormInit && chooseDialogCon.slice().map((c) => {
		      c.items.map((fields) => {
		        items.push({
	                com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@w3rtr5@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'w3rtr5'}`}
  label={`${fields.label}`}
  labelCol={{ span: `${fields.labelcol}` }}
  wrapperCol={{ span: `${fields.fieldcol}` }}
	                >
		            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@lxxjb3@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'lxxjb3'}`} fieldConfig={fields} form={formImport} formParams={formParams} />
		          </WeaFormItem>),
	                colSpan: 1,
		      });
		    });
	    });
	    }
	    if (dialogType === 'onBatchMove' || dialogType === 'onMove') {
	    	const { isFormInit } = form1;
		    const formParams = form1.getFormParams();
		    isFormInit && chooseDialogCon1.slice().map((c) => {
		      c.items.map((fields) => {
		        items.push({
	                com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@8s35w0@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : '8s35w0'}`}
  label={`${fields.label}`}
  labelCol={{ span: `${fields.labelcol}` }}
  wrapperCol={{ span: `${fields.fieldcol}` }}
	                >
		            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@lofdm7@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'lofdm7'}`} fieldConfig={fields} form={form1} formParams={formParams} />
		          </WeaFormItem>),
	                colSpan: 1,
		      });
		    });
	    });
	    }
	    if (dialogType === 'addAlbumReview' || dialogType === 'editAlbumReview') {
	    	const { isFormInit } = form4;
		    const formParams = form4.getFormParams();
		    isFormInit && chooseDialogCon4.slice().map((c) => {
		      c.items.map((fields) => {
		        items.push({
	                com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@w9gn6y@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'w9gn6y'}`}
  label={`${fields.label}`}
  labelCol={{ span: `${fields.labelcol}` }}
  wrapperCol={{ span: `${fields.fieldcol}` }}
	                >
		            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@h8tih3@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'h8tih3'}`} fieldConfig={fields} form={form4} formParams={formParams} />
		          </WeaFormItem>),
	                colSpan: 1,
		      });
		    });
	    });
	    }
	    group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@h8werl@WeaSearchGroup`} col={1} needTigger={false} showGroup={true} items={items} />);
	    return group;
	  }

  hsaUploadState=(state) => {
	  const { FrameStore } = this.props;
	  const { setHasFile } = FrameStore;
	  FrameStore.setHasFile(state);
  }

  saveDialog1() {
	    const { FrameStore } = this.props;
	    const { formImport, dialogType, saveDialog1, setVisible, parentid, comsWeaTableStore,
	    	form1, form2, tempmoveid, tempeditid, setVisible2, form4, reviewid, currentid, hasFile } = FrameStore;
	    const selectedRowKeys = comsWeaTableStore.selectedRowKeys.join();
	    if (dialogType === 'upload') {
	    	if (hasFile == 'false') {
            	message.success(getLabel(127674, '上传中...'));
            	window.startUploadAll();
            	let save1 = setInterval(() => {
            		let hasFile1 = FrameStore.hasFile;
            		if (hasFile1 === 'uploaded') {
            			clearInterval(save1);
            			FrameStore.saveDialog1({ parentid, dialogType, ...formImport.getFormParams() });
            			FrameStore.form2.reset();
            			setVisible(false);
            		}
	    		}, 200);
	    	} else {
                Modal.warning({
                 title: getLabel(15172, '系统提示'),
                 content: getLabel('125389,15707', '请先选择照片'),
             });
            }
	    }
	    if (dialogType === 'onNewFolder' || dialogType === 'onEdit') {
	    	formImport.validate().then((f) => {
	            if (f.isValid) {
	            	if (dialogType === 'onEdit') {
	            		FrameStore.saveDialog1({ parentid, currentid: tempeditid, dialogType, ...formImport.getFormParams() });
	            	} else {
	            		FrameStore.saveDialog1({ parentid, dialogType, ...formImport.getFormParams() });
	            	}
	            	FrameStore.formImport.reset();
	            	setVisible(false);
	            	setVisible2(false);
	            } else {
	                f.showErrors();
	                   Modal.warning({
	                    title: getLabel(15172, '系统提示'),
	                    content: getLabel(383975, '必要信息不完整，红色标记为必填项！'),
	                });
	            }
	        });
	    }
	    if (dialogType === 'onBatchMove' || dialogType === 'onMove') {
	    	form1.validate().then((f) => {
	            if (f.isValid) {
	            	if (dialogType === 'onMove') {
	            		FrameStore.saveDialog1({ parentid, tempid: tempmoveid, dialogType, ...form1.getFormParams() });
	            	} else {
	            		FrameStore.saveDialog1({ parentid, tempid: selectedRowKeys, dialogType, ...form1.getFormParams() });
	            	}
	            	comsWeaTableStore.selectedRowKeys = [];
	            	FrameStore.form1.reset();
	            	comsWeaTableStore.selectedRowKeysAllPages = [];
	            	setVisible(false);
	            } else {
	                f.showErrors();
	                   Modal.warning({
                	   title: getLabel(15172, '系统提示'),
                       content: getLabel(383975, '必要信息不完整，红色标记为必填项！'),
	                });
	            }
	        });
	    }

	    if (dialogType === 'addAlbumReview' || dialogType === 'editAlbumReview') {
	    	form4.validate().then((f) => {
	            if (f.isValid) {
	            	if (dialogType === 'editAlbumReview') {
	            		FrameStore.saveDialog2({ reviewid, photoid: currentid, dialogType, ...form4.getFormParams() });
	            	} else {
	            		FrameStore.saveDialog2({ photoid: currentid, dialogType, ...form4.getFormParams() });
	            	}
	            	FrameStore.form4.reset();
	            	setVisible(false);
	            } else {
	                f.showErrors();
	                   Modal.warning({
                	   title: getLabel(15172, '系统提示'),
                       content: getLabel(383975, '必要信息不完整，红色标记为必填项！'),
	                });
	            }
	        });
	    }
	}

  	closeDialog1() {
  		const { FrameStore } = this.props;
 	    const { formImport, setVisible, dialogType, form1, form2, form4 } = FrameStore;
  		setVisible(false);
      	formImport.reset();
      	form1.reset();
      	form2.reset();
      	form4.reset();
  	}

  	closeDialog2() {
  		const { FrameStore } = this.props;
 	    const { setVisible2 } = FrameStore;
  		setVisible2(false);
  	}

  	// 批量删除
  	deletePhotoBatch() {
  		const { FrameStore } = this.props;
  	    const { comsWeaTableStore, key, deletePhotoBatch, deleteWarm } = FrameStore;
  	    const selectedRowKeys = comsWeaTableStore.selectedRowKeys.join();

  	    confirm({
	  		title: deleteWarm.title,
	  		content: deleteWarm.subTitle == '' ? '' : (<span style={{ color: 'red' }}>({deleteWarm.subTitle})</span>),
	  		onOk() {
  	    		FrameStore.deletePhotoBatch({ tempid: selectedRowKeys });
	  		},
	  		onCancel() {},
	  	});
  	}

  	getTabButtonsAd = () => {
  		const { FrameStore } = this.props;
  		const { form, doSearch, setShowSearchAd, parentid } = FrameStore;
		return [
			(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@acp7fz@searchBtn`}
  type="primary"
  onClick={() => {
				doSearch({ parentid, ...form.getFormParams() });
				setShowSearchAd(false);
				}}
			>{getLabel(197, '搜索')}</Button>),
			(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@say680@resetBtn`} type="ghost" onClick={() => form.reset()}>{getLabel(2022, '重置')}</Button>),
			(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@wvro13@closeBtn`}
  type="ghost"
  onClick={() => {
		        setShowSearchAd(false);
		      }}
			>{getLabel(201, '取消')}</Button>),
		];
	}

  	getSearchs = () => {
  		const { FrameStore } = this.props;
		const { conditioninfo, form } = FrameStore;
	    const { isFormInit } = form;
	    let group = [];
	    const formParams = form.getFormParams();
	    isFormInit && toJS(conditioninfo).map((c) => {
	      let items = [];
	      c.items.map((fields) => {
	      	if (fields.isQuickSearch) {
	          this.quickSearchPara = fields.domkey[0];
	        }
	        items.push({
	          com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@crt3lz@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'crt3lz'}`}
  label={`${fields.label}`}
  labelCol={{ span: `${fields.labelcol}` }}
  wrapperCol={{ span: `${fields.fieldcol}` }}
	          >
	              <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@kotxd6@${(fields.domkey && fields.domkey[0]) ? fields.domkey[0] : 'kotxd6'}`} fieldConfig={fields} form={form} formParams={formParams} />
	            </WeaFormItem>),
	            colSpan: 1,
	          });
	      });
	      group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@0ykxb6@searchs_WeaSearchGroup`} needTigger={true} title={c.title} showGroup={c.defaultshow} items={items} />);
	    });
	    return group;
	}
  	getProcess() {
  		 const { FrameStore } = this.props;
       const { albumRate, showname } = FrameStore;
       return (
           <div style={{ float: 'left', margin: '10px', position: 'absolute', zYndex: '1', paddingTop: '7px', paddingLeft: '15px' }}>
              <span style={{ color: '#2db7f5', verticalAlign: 'top' }}>{showname}</span>&nbsp;&nbsp;
              <span style={{ verticalAlign: 'top' }}>{getLabel(84036, '相册空间使用情况')}:&nbsp;&nbsp;</span>
              <div style={{ width: '300px', float: 'right', display: 'inline-block', verticalAlign: 'top', height: '20px' }}>
                <WeaProgressCom ecId={`${this && this.props && this.props.ecId || ''}_WeaProgress@juc6dy`} percent={albumRate} />
              </div>
            </div>
       );
    }

  // 分页组件操作菜单
  	getOperatesClick(record, index, operate) {
    	const { FrameStore } = this.props;
    	const { deleteWarm, setDialogType, setVisible, setTempmoveid, setTempeditid } = FrameStore;
    	const funName = operate.href.replace(/(javascript\:)|(\(\))/g, () => '');
        if (funName.indexOf('onEdit') >= 0) {
        	setTempeditid(record.id);
        	setDialogType('onEdit');
            setVisible(true);
        } else if (funName.indexOf('onMove') >= 0) {
        	setDialogType('onMove');
        	setTempmoveid(record.id);
            setVisible(true);
        } else if (funName.indexOf('onDelete') >= 0) {
        	confirm({
    	  		title: deleteWarm.title,
    	  		content: deleteWarm.subTitle == '' ? '' : (<span style={{ color: 'red' }}>({deleteWarm.subTitle})</span>),
    	  		onOk() {
    	    		FrameStore.deletePhotoBatch({ tempid: record.id });
    	  		},
    	  		onCancel() {},
    	  	});
        }
    }


  	reRenderColumns = (columns) => {
  		let newColumns = columns.map((column) => {
  	      if (column.dataIndex == 'photoName') {
  	        let newColumn = { ...column };
  	        newColumn.render = (text, record, index) => (
  	            <a onClick={this.albumOnView.bind(this, record.id)} title={record.photoNamespan} className="cursor-pointer">
  	              {record.photoNamespan}
  	            </a>
  	          );
  	        return newColumn;
  	      }
  	      return column;
  		});
  		return newColumns;
    }

  	albumOnView(currentid) {
  		const { FrameStore } = this.props;
    	FrameStore.albumView(currentid);
  	}

  	getShowAlbum() {
  	    const { FrameStore } = this.props;
  	    const { albumphotoall, tableStore1 } = FrameStore;
  	    return (
  	    	<div style={{ float: 'left', margin: 10, width: '1320px!important', height: '600px!important' }}>
		        <div className="flexslider" style={{ width: 800, height: 550, margin: 10, position: 'relative', overflow: 'hidden', float: 'left' }}>
			    	<ul className="slides">
				    	<li className={`${albumphotoall.photoindex}_photo_li_index   flex-active-slide`} style={{ display: 'list-item' }}>
							<img className={`photo_index_${albumphotoall.photoindex}   photo_id_${albumphotoall.albumid}`}
  src={albumphotoall.photoPath}
  alt=""
  style={{ cursor: 'pointer' }}
  onClick={e => window.open(albumphotoall.photoPath, '', '')}
							/>
						</li>
			    	</ul>
			    	<ul className="flex-direction-nav">
				    	<li>
		    				<a className="flex-prev"
  onClick={e => FrameStore.albumView(albumphotoall.preindexid)}
  style={{ display: albumphotoall.preindexid == 'n' ? 'none' : 'block' }}
		    				>Previous</a>
		    				</li>
	    				<li>
		    				<a className="flex-next"
  onClick={e => FrameStore.albumView(albumphotoall.nextindexid)}
  style={{ display: albumphotoall.nextindexid == 'n' ? 'none' : 'block' }}
		    				>Next</a>
	    				</li>
			    	</ul>
			    </div>
			    <div style={{ float: 'left', width: 420, height: 570, margin: 10 }}>
			    	<div style={{ height: 110, margin: 10, fontSize: 12 }}>
			    	<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@tb4s6t`} title={getLabel(84061, '照片信息')} customComponent={this.getEditAlbumbutton()} showGroup={true} col={1} items={[]} >
			    		<ul>
				    		<li>{getLabel(84033, '照片标题')}  :{albumphotoall.photoName}</li>
				    		<li style={{ height: '5px' }} />
				    		<li>{getLabel(26083, '上传人')}    :{albumphotoall.username}</li>
				    		<li style={{ height: '5px' }} />
				    		<li>{getLabel(27780, '上传日期')}  :{albumphotoall.postdate}</li>
				    		<li style={{ height: '5px' }} />
				    		<li>{getLabel(433, '描述')}      :{albumphotoall.photoDescription}</li>
				    	</ul>
			    	</WeaSearchGroup>
			    	</div>
			    	<div style={{ margin: 20, height: 420, overflowY: 'auto' }}>
				    <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@bd2ar1`} title={getLabel(675, '评论')} customComponent={this.getAddReviewbutton()} showGroup={true} col={1} items={[]} >
						    <WeaTable
                  ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@yb2ftn`}
                  comsWeaTableStore={tableStore1}
                  sessionkey={albumphotoall.sessionkey1}
                  hasOrder={true}
                  needScroll={true}
                  pageAutoWrap={false}
                  getColumns={this.reRenderColumns1}
						    />
				    </WeaSearchGroup>
					</div>
			    </div>
		    </div>
  	    );
  	}

  	getEditAlbumbutton() {
		 const { FrameStore } = this.props;
		 const { setTempeditid, currentid, setDialogType, setVisible, operatelevel } = FrameStore;
		 let isDisabled1 = false;
		 if (operatelevel < 1) {
     		isDisabled1 = true;
         }
	   	 return (
	   			 <button type="button"
  className="ant-btn ant-btn-primary"
  disabled={isDisabled1}
  onClick={() => {
	   				setTempeditid(currentid);
	   				setDialogType('onEdit');
	   				setVisible(true);
	   	            }}
	   			 ><span>{getLabel(93, '编辑')}</span></button>
	   	 );
    }

  	getAddReviewbutton() {
  		const { FrameStore } = this.props;
  		const { setDialogType, setVisible } = FrameStore;
  		return (
   			 <button type="button"
     className="ant-btn ant-btn-primary ant-btn-sm"
     onClick={() => {
	   				setDialogType('addAlbumReview');
	   				setVisible(true);
	   	            }}
     title={getLabel(1421, '新增')}
   			 >
   			<i className="anticon anticon-plus" />
   			 </button>
  		);
    }


  	reRenderColumns1 = (columns) => {
  		const { FrameStore } = this.props;
  		const { currentid } = FrameStore;
  		let newColumns = columns.map((column) => {
  	      if (column.dataIndex == 'tempid') {
  	        let newColumn = { ...column };
  	        newColumn.render = (text, record) => {
  	        	if (record.tempidspan) {
  	        		return (
  	  	        		  <div>
  	  	                <a style={{ cursor: 'pointer', color: '#1098ff' }} onClick={this.editAlbumReview.bind(this, record.tempid)} >{getLabel(93, '编辑')}</a>
  		   	            <a style={{ cursor: 'pointer', color: '#1098ff', marginLeft: '10px' }}
    onClick={() => {
  		   	            	FrameStore.deleteAlbumReview({ photoreviewid: record.tempid, photoid: currentid });
  			   	        }} >{getLabel(91, '删除')}</a>
  			   	        </div>
  	  	          );
  	        	}
  	        };
  	        return newColumn;
  	      }
  	      return column;
  		});
  		return newColumns;
    }

  	editAlbumReview(tempreviewid) {
  		const { FrameStore } = this.props;
  		const { setDialogType, setVisible, deleteAlbumReview, setReviewid } = FrameStore;
      	setReviewid(tempreviewid);
      	setDialogType('editAlbumReview');
      	setVisible(true);
  	}
}

// 组件检错机制
class MyErrorHandler extends React.Component {
    render() {
        const hasErrorMsg = this.props.error && this.props.error !== '';
        return (
            <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@3fdkaf`} msg={hasErrorMsg ? this.props.error : getLabel(384697, '对不起，该页面异常，请联系管理员！')} />
        );
    }
}


Frame = WeaTools.tryCatch(React, MyErrorHandler, { error: '' })(Frame);


export default Frame;
